Vue.component('my-header', {
  props: [],
  data: function () { },
  template: '<div><div class="top">' +
    '<div class="title">' +
    '<div class="content1">您好，欢迎来到塔县公共服务平台' +
    '</div>' +
    '<div class="content2">' +
    '<a href="register.html">注册</a><a>/</a><a href="login.html">登录</a>' +
    '</div>' +
    '</div>' +
    '</div>' +
    '</div>',
  methods: {

  }
})
Vue.component('my-nav', {
  props: ['active'],
  data: function () {

  },
  template: '<div>' +
    '<div class="logo">' +
    '<div class="content">' +
    '<a href="../../index.html"><img src="../../img/logo .png" alt=""></a>' +
    '</div>' +
    '</div>' +
    '<div class="bottom">' +
    '<div class="navbar-bottom">' +
    '<nav class="navbar bg-dark navbar-light">' +
    '<ul class="navbar-nav">' +
    '<li class="nav-item" :class="{active:active==0}">' +
    '<a class="nav-link" href="../../index.html">首页' +
    '<p></p>' +
    '</a>' +
    '</li>' +
    '<li class="nav-item" :class="{active:active==1}">' +
    '<a class="nav-link" href="news-index.html">新闻资讯' +
    '<p></p>' +
    '</a>' +
    '</li>' +
    '<li class="nav-item" :class="{active:active==2}">' +
    '<a class="nav-link" href="public-index.html">公共服务中心' +
    '<p></p>' +
    '</a>' +
    '<div>' +
    '<ul class="hoverul">' +
    '<li><a href="public-index.html">农产品展销中心</a></li>' +
    '<li><a href="public-index-peixun.html">电商人才培训中心</a></li>' +
    '<li><a href="public-index-wuliu.html">仓储物流配送中心</a></li>' +
    '<li><a href="public-index-yunying.html">电商服务运营中心</a></li>' +
    '<li><a href="public-index-fuhua.html">创客基地孵化中心</a></li>' +
    '<li><a href="public-index-shujv.html">大数据中心</a></li>' +
    '</ul>' +
    '</div>' +
    '</li>' +
    '<li class="nav-item" :class="{active:active==3}">' +
    '<a class="nav-link" href="site-index.html">服务站点' +
    '<p></p>' +
    '</a>' +
    '<div>' +
    '<ul class="hoverul">' +
    '<li><a href="site-index.html">站点动态</a></li>' +
    '<li><a href="site-index-map.html">站点地图</a></li>' +
    '<li><a href="site-index-fengcai.html">站长风采</a></li>' +
    '</ul>' +
    '</div>' +
    '</li>' +
    '<li class="nav-item" :class="{active:active==4}">' +
    '<a class="nav-link" href="training-index.html">电商培训' +
    '<p></p>' +
    '</a>' +
    '<div>' +
    '<ul class="hoverul">' +
    '<li><a href="training-index.html">在线课程</a></li>' +
    '<li><a href="training-index-xianxia.html">线下培训</a></li>' +
    '<li><a href="training-index-jiangshi.html">知名讲师</a></li>' +
    '</ul>' +
    '</div>' +
    '</li>' +
    '<li class="nav-item" :class="{active:active==5}">' +
    '<a class="nav-link" href="link-index.html">供应链' +
    '<p></p>' +
    '</a>' +
    '<div>' +
    '<ul class="hoverul">' +
    '<li><a href="link-index.html">品牌建设</a></li>' +
    '<li><a href="link-index-biaozhun.html">标准化体系</a></li>' +
    '<li><a href="link-index-suyuan.html">溯源系统</a></li>' +
    '<li><a href="link-index-wuliu.html">物流系统</a></li>' +
    '</ul>' +
    '</div>' +
    '</li>' +
    '<li class="nav-item" :class="{active:active==6}">' +
    '<a class="nav-link" href="fupin-index.html">电商扶贫' +
    '<p></p>' +
    '</a>' +
    '</li>' +
    '<li class="nav-item" :class="{active:active==7}">' +
    '<a class="nav-link" href="special-index.html">扶贫专项' +
    '<p></p>' +
    '</a>' +
    '</li>' +
    '<li class="nav-item" :class="{active:active==8}">' +
    '<a class="nav-link" href="travel-index.html">乡村旅游' +
    '<p></p>' +
    '</a>' +
    '</li>' +
    '<li class="nav-item" :class="{active:active==9}">' +
    '<a class="nav-link" href="upside-index.html">农产品上行' +
    '<p></p>' +
    ' </a>' +
    '</li>' +
    '</ul>' +
    '</nav>' +
    ' </div>' +
    '</div>' +
    '</div>' +
    '</div>',
  methods: {

  }
})

Vue.component('my-footer', {
  props: [],
  data: function () { },
  template: '<div class="footer">' +
    '<div class="content">' +
    '<p class="p1">Copyright©2018 www.zs2200mall.com All rights reserved. ICP备1622059108号-1</p><p class="p2">地址:新疆维吾尔自治区喀什地区塔什库尔干塔吉克自治县奇石广场</p>' +
    '</div>' +
    '</div>',
  methods: {

  }
})
Vue.component('zpagenav', {
  template: '<nav class="zpagenav">' +
    '<ul class="page-ul" style="margin-bottom:20px;">' +
    '<li v-bind:key="index" v-for="(item,index) in pageList" v-bind:class ="item.class" @click.stop="setPage(item)">' +
    '<a href="#" v-html="item.html" style="display: block; "></a>' +
    '</li>' +
    '</ul>' +
    '</nav>',
  props: {
    prevHtml: String,
    nextHtml: String,
    page: Number,
    total: Number,
    pageSize: Number,
    maxPage: Number
  },
  computed: {
    pageList: function () {
      var _this = this;
      var pageList = [];
      var pageCount = Math.ceil(_this.total / _this.pageSize);
      var page = _this.page;
      var prevHtml = _this.prevHtml ? _this.prevHtml : '&lt;';
      var nextHtml = _this.nextHtml ? _this.nextHtml : '&gt;';
      var maxPage = _this.maxPage ? _this.maxPage : 9;

      var hasPrev = page > 1;
      var hasNext = page < pageCount;

      //上一页
      pageList.push({
        class: hasPrev ? '' : 'disabled',
        page: hasPrev ? page - 1 : page,
        html: prevHtml
      });

      //首页
      pageList.push({
        class: page == 1 ? 'active' : '',
        page: 1,
        html: 1
      });

      var p0 = Math.floor(maxPage / 2);
      var p1 = 1 + 2 + p0; //首页+省略至少2个页码+中间页面数的一半

      var start, end;
      if (page >= p1) {
        start = page - p0;
        //前置省略号
        pageList.push({
          class: 'dot',
          page: page,
          html: '...'
        });
      } else {
        start = 2;
      }

      var p2 = page + p0;
      if (p2 < pageCount) {
        end = p2;
      } else {
        end = pageCount - 1;
      }

      //页码列表
      for (var i = start; i <= end; i++) {
        pageList.push({
          class: page == i ? 'active' : '',
          page: i,
          html: i
        });
      }

      if (end < pageCount - 1) {
        //后置省略号
        pageList.push({
          class: 'dot',
          page: page,
          html: '...'
        });
      }

      //尾页
      if (pageCount > 1) {
        pageList.push({
          class: page == pageCount ? 'active' : '',
          page: pageCount,
          html: pageCount
        });
      }

      //下一页
      pageList.push({
        class: hasNext ? '' : 'disabled',
        page: hasNext ? page + 1 : page,
        html: nextHtml
      });

      return pageList;
    }
  },
  methods: {
    setPage: function (item) {

      if (item.class == '') {
        this.$emit('pagehandler', item.page);
      }
    }
  }
});

Vue.component('my-banner', {
  props: [],
  data: function () { },
  template: '<div id="myCarousel" class="carousel slide" data-ride="carousel" data-wrap="true" data-interval="4000">' +
    '<ol class="carousel-indicators">' +
    '<li data-target="#myCarousel" data-slide-to="0" class="active"></li>' +
    '<li data-target="#myCarousel" data-slide-to="1"></li>' +
    '<li data-target="#myCarousel" data-slide-to="2"></li>' +
    '</ol>' +
    '<div class="carousel-inner">' +
    '<div class="item active">' +
    '<img src="../../img/banner1.jpg" alt="First slide">' +
    '</div>' +
    '<div class="item">' +
    '<img src="../../img/banner2.jpg" alt="First slide">' +
    '</div>' +
    '<div class="item">' +
    '<img src="../../img/banner3.jpg" alt="First slide">' +
    '</div>' +
    '</div>' +
    '</div>',
  methods: {

  }
})
function getAddrPro(name) {
	return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [, ""])[1].replace(/\+/g, '%20')) || null
}
